<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>空托盘入库</title>
    <!--    <script type="text/javascript" src="static/js/jquery.min.js"></script>-->
    <script th:src="@{/js/jquery.min.js}"></script>
</head>
<style>
    body {
        width: 100%;
        height: 100%;
        font-size: 15px;
    }
    .div {
        text-align: center;
        margin: 0 auto ;
        border: black solid 1px;
        width: 80%;
        height: 80%;
        padding: 10px;
    }
    .label {
        text-align-last: justify;
        text-align:justify;
        text-justify:distribute-all-lines; // 这行必加，兼容ie浏览器
    }
    .tr{
        height: 30px;
    ;
    }
    /*.ti
    tle{*/
    /*    width: 80%;*/
    /*    height: 40%;*/
    /*    text-align: left;*/
    /*    line-height: 10%;*/
    /*}*/
    /*body, td, th {*/
    /*    font-family: Verdana, Arial, Helvetica, sans-serif;*/
    /*    font-size: 65px;*/
    /*}*/

    /*input[type="text"] {*/
    /*    height: 30%;*/
    /*    border: 2px solid #000000;*/
    /*    padding: 0 6px;*/
    /*    width: 60%;*/
    /*    font-size: 60px;*/
    /*}*/

    input[type="button"] {
        height: 15%;
        border: 2px solid #545454;
        border-radius: 5px;
        padding: 3px 6px;
        width: 30%;
        font-size: large;
        margin: 9px 9px auto;


    }

    /*select {*/
    /*    border: 2px solid #000000;;*/
    /*    width: 60%;*/
    /*    height: 40%;*/
    /*    font-size: 60px;*/
    /*    background-color: #ffffff;*/
    /*}*/

</style>
<body>

<div class="div" >
    <div class="title" style="text-align: center">
        <h3>空托盘入库</h3>
    </div>
    <hr>
    <div style="display: inline-block;margin: auto 0">
        <table >
            <tr class="tr">
                <td align="right"><div class="label">托盘条码：</div></td>
                <td align="left"><input type="text" id="trayCode"></td>
            </tr>
<!--            <tr class="tr">-->
<!--                <td align="right"><div class="label">托盘类型：</div></td>-->
<!--                <td align="left">-->
<!--                    <select type="text" id="type" class="form-control" style="width:150px;height: 25px">-->
<!--                        <option value="1">大托盘</option>-->
<!--                        <option value="2">小托盘</option>-->
<!--                    </select>-->
<!--                </td>-->
<!--            </tr>-->
        </table>
        <input type="button" id="but" value="提交" onclick="ktpIn()">
    </div>

</div>
</body>
<script>
    var url = "/rf/ktp"

    function ktpIn() {
        var trayCode = $("#trayCode").val();
        var type = $("#type").val();

        if (trayCode == "" || trayCode == undefined) {
            alert("提交失败,托盘条码不能为空！");
            return;
        }
        //控制按钮多次点击
        var btn = document.getElementById('but');//首先需要获取的是哪一个按钮的id
        btn.disabled = 'disabled';//只要点击就将按钮的可点击的状态更改为不可以点击的状态
        setTimeout(function () {//设置时间，多久可以改变状态为可以点击
            btn.disabled = '';
        }, 5000);

        $.ajax({
            url: url + "/KTP_in",
            data: {"trayCode": trayCode},
            type: "post",
            dataType: "json", //返回数据的类型
            success: function (result) {
                alert(result.msg)
                $("#trayCode").val("")

            }
        })

    }
</script>
</html>